﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link href="../../Content/bootstrap.css" rel="stylesheet" />
    <link href="css/fileinput.css" rel="stylesheet" />
    <script src="../jquery-1.10.2.js"></script>
    <script src="js/fileinput.js"></script>
    <script src="js/locales/zh.js"></script>
</head>
<body>
    <form enctype="multipart/form-data">
        <input type="file" name="txt_file" id="txt_file" data-show-preview="false" data-show-upload="false" class="file-loading" />
    </form>

    <script>
        $(function () {
            //0.初始化fileinput
            var oFileInput = new FileInput();
            oFileInput.Init("txt_file", "http://localhost:35330/image/upload2");
        });
        //初始化fileinput
        var FileInput = function () {
            var oFile = new Object();
            //初始化fileinput控件（第一次初始化）
            oFile.Init = function (ctrlName, uploadUrl) {
                var control = $('#' + ctrlName);
                //初始化上传控件的样式
                control.fileinput({
                    language: 'zh', //设置语言
                    uploadAsync: true,//异步上传
                    uploadUrl: uploadUrl, //上传的地址
                    allowedFileExtensions: ['jpg', 'png'],//接收的文件后缀
                    showUpload: true, //是否显示上传按钮
                    showCaption: false,//是否显示标题
                    browseClass: "btn btn-primary", //按钮样式
                    dropZoneEnabled: false,//是否显示拖拽区域
                    minImageWidth: 300, //图片的最小宽度
                    minImageHeight: 300,//图片的最小高度
                    maxImageWidth: 500,//图片的最大宽度
                    maxImageHeight: 500,//图片的最大高度
                    maxFileSize: 6000,//单位为kb，如果为0表示不限制文件大小
                    minFileCount: 0,
                    maxFileCount: 10, //表示允许同时上传的最大文件个数
                    enctype: 'multipart/form-data',
                    validateInitialCount: true,
                    previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                    msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
                });
                $("#txt_file").on("filebatchselected", function (event, files) {
                    console.log("filebatchselected  选择文件后处理事件");
                    $("#txt_file").fileinput("upload");
                });
                $('#txt_file').on('fileerror', function (event, data, msg) {
                    console.log("fileerror  异步上传错误结果处理");
                });
                $("#txt_file").on("fileuploaded", function (event, data, previewId, index) {
                    console.log("fileuploaded  异步上传成功结果处理");
                    alert(data.response.src);
                    console.dir(data);           //这是在别人的指点下才会用的，可以查看对象，这里主要是JSON对象
                    alert(data.files[0].name);
                });
                $('#txt_file').on('filebatchuploaderror', function (event, data, previewId, index) {
                    console.log("filebatchuploaderror  同步上传错误结果处理");
                });

                $('#txt_file').on('filepreupload', function (event, data, previewId, index) {
                    console.log("filepreupload  同步上传成功结果处理");
                    alert(data.response.src);
                    console.dir(data);           //这是在别人的指点下才会用的，可以查看对象，这里主要是JSON对象
                    alert(data.jqXHR.responseText);
                    entity = data;//entity.jqXHR.responseText
                });
                //导入文件上传完成之后的事件
                $("#txt_file").on("fileuploaded", function (event, data, previewId, index) {
                    $("#myModal").modal("hide");
                    var data = data.response.lstOrderImport;
                    if (data == undefined) {
                        toastr.error('文件格式类型不正确');
                        return;
                    }
                    //1.初始化表格
                    var oTable = new TableInit();
                    oTable.Init(data);
                    $("#div_startimport").show();
                });
            }
            return oFile;
        };
    </script>
</body>
</html>